<template>
	<view class="app">
		<!-- 页面内容开始 -->
		<view class="weChat">
			<u-form :model="form1" ref="form1"
			:label-width="labelWidth">

				<u-form-item label="您的手机号" :label-width="labelWidth" prop="mobile">
					<u-input placeholder="请输入手机号" v-model="form1.mobile"></u-input>
				</u-form-item>
				<view class="tips">提交您的手机号之后，您的粉丝可以通过手机号联系您!</view>
				<view class="tips">该手机号可以随时更改，且可以与账号绑定的手机号不一致。</view>

				<u-form-item label="您的微信号" :label-width="labelWidth" prop="weixin_no">
					<u-input placeholder="请输入微信号" v-model="form1.weixin_no"></u-input>
				</u-form-item>
				<view class="tips">提交您的微信号之后，您的粉丝可以通过微信号加您为好友!</view>

				<u-form-item label="上传微信二维码（选填）" :label-width="labelWidth" prop="weixin_qrcode">
					<vk-data-upload
						v-model="form1.weixin_qrcode"
						:limit="1"
						:show-header="false"
						upload-text="微信二维码"
						style="margin-top: 10rpx;"
					></vk-data-upload>
				</u-form-item>
				<view class="tips">提交您的微信二维码之后，您的粉丝可以通过扫码加您为好友!</view>
				<view class="tips">微信二维码获取方法: <br/>打开微信-> 我 -> 点击微信昵称或头像进入个人信息页面 -> 我的二维码（二维码名片） -> 右上角3个点 -> 保存图片（保存到手机）</view>

				<!-- <u-form-item label="接收通知的邮箱" :label-width="labelWidth" prop="email" >
					<u-input placeholder="请输入您的邮箱（选填）" v-model="form1.email"></u-input>
				</u-form-item>
				<view class="tips">建议填写 163邮箱，提交您的邮箱后，在您的客户下单付款时、订单奖励结算时，系统会发邮件通知您！（只在早上9点-晚上10点之间进行通知）</view> -->

				<u-button @click="submit" type="success" style="margin-top: 80rpx;">保存</u-button>
			</u-form>
		</view>
		<!-- 页面内容结束 -->
		<!-- 全局公共浮球导航模块 -->
		<vk-data-float-ball :scroll-top="scrollTop" ></vk-data-float-ball>
		<vk-data-loading v-model="loading" delayTime="0"></vk-data-loading>
	</view>
</template>

<script>
	var vk = uni.vk;			// vk依赖
	export default {
		data() {
			// 页面数据变量
			return {
				loading:false,
				// init请求返回的数据
				data:{

				},
				// 表单请求数据
				form1:{
					mobile:"",
					weixin_no:"",
					weixin_qrcode:""
				},
				rules:{
					mobile:[
						{ validator:uni.vk.pubfn.validator("mobile"), message: '手机号格式错误', trigger: ['blur'] }
					],
					// email:[
					// 	{ validator:uni.vk.pubfn.validator("email"), message: '邮箱格式错误', trigger: ['blur'] }
					// ]
				},
				labelWidth:260,
				scrollTop:0,
			}
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		// 监听 - 页面每次【加载时】执行(如：前进)
		onLoad(options = {}) {
			vk = uni.vk;
			this.options = options;
			this.init(options);
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady(){
			this.$refs.form1.setRules(this.rules);
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		onShow() {


		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {


		},
		// 监听 - 页面下拉刷新
		onPullDownRefresh() {

		},
		// 监听 - 页面触底部
		onReachBottom(){

		},
		// 函数
		methods: {
			// 页面数据初始化函数
			init(options){
				let that = this;
				that.form1.mobile = vk.getVuex('$user.userInfo.social_info.mobile');
				that.form1.weixin_no = vk.getVuex('$user.userInfo.social_info.weixin_no');
				that.form1.weixin_qrcode = vk.getVuex('$user.userInfo.social_info.weixin_qrcode');
			},
			pageTo(path){
				vk.navigateTo(path);
			},
			// 提交
			submit(){
				let that = this;
				that.$refs.form1.validate(valid => {
					if (!valid) return;
					vk.callFunction({
						url: 'client/salesman.updateSocialInfo',
						loading:true,
						data:that.form1,
						success:function(data){
							vk.alert("保存成功",() => {
								vk.navigateBack();
							});
						}
					});
				});
			}
		},
		// 计算属性
		computed:{

		}
	}
</script>
<style lang="scss" scoped>
.app{
	height: 100%;
	padding: 10rpx 15rpx;
}
.weChat{
	padding: 10rpx 15rpx;
}
.agreement {
	display: flex;
	align-items: center;
	margin: 40rpx 0;

	.agreement-text {
		padding-left: 8rpx;
		color: #909399;
	}
}
.upload{
	background-color: pink;
}
.tips{
	font-size: 24rpx;
	padding: 10rpx 0;
	color: #909399;
}
</style>
